<!doctype html>
[#escape x as (x)!?html]
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>留言板 - ${site.fullNameOrName}${global.customs['poweredBy']}</title>
    <meta name="keywords" content="留言板">
    <meta name="description" content="留言板">
    [#include 'inc_meta.html'/]
    [#include 'inc_css.html'/]
    [#include 'inc_js.html'/]
    <script>
        $(function () {
            $("#guestbookForm").validate();
        });
    </script>
</head>
<body>
[#include 'inc_header.html'/]
[#assign conf = site.getConf('com.jspxcms.ext.domain.SiteGuestbook')/]
<div class="container">
    <div class="row">
        <div class="col mt-1">
            <div class="d-flex align-items-center py-1 border-bottom">
                <div class="flex-grow-1 h5 mb-0"><a href="${dy}/guestbook/create">我要留言</a></div>
                <div><a class="btn btn-primary" href="${dy}/guestbook" role="button">留言板</a></div>
            </div>
            <div class="mt-3">
                [#if conf.mode == 0]
                <div class="guestbook-i mt20">留言未启用</div>
                [#elseif conf.mode == 1 && !user??]
                <div class="guestbook-i mt20">请<a class="a-hover guestbook-login" href="${ctx}/login?fallbackUrl=${url}">登录</a>后再留言</div>
                [#else]
                <form id="guestbookForm" action="${ctx}/guestbook/create" method="post" class="bg-light p-3 mb-3">
                    <input type="hidden" name="status_0" value="留言成功！">
                    <input type="hidden" name="status_1" value="留言成功，请等待管理员审核！">
                    <input type="hidden" name="nextUrl" value="${ctx}/guestbook">
                    <div class="form-group row">
                        <label for="title" class="col-sm-2 col-form-label">留言标题<strong class="text-danger">*</strong></label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="title" name="title" maxlength="150" required>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="text" class="col-sm-2 col-form-label">留言内容<strong class="text-danger">*</strong></label>
                        <div class="col-sm-10">
                            <textarea type="text" class="form-control" id="text" name="text" maxlength="${conf.maxLength}" rows="8" required></textarea>
                        </div>
                    </div>
                    <fieldset class="form-group">
                        <div class="row">
                            <legend class="col-form-label col-sm-2 pt-0">留言类别<strong class="text-danger">*</strong></legend>
                            <div class="col-sm-10">
                                [@GuestbookTypeList;list]
                                [#list list as type]
                                <div class="custom-control custom-radio custom-control-inline">
                                    <input class="custom-control-input" type="radio" name="typeId" id="typeId${type_index}" value="${type.id}" required [#if type_index==0]checked[/#if]>
                                    <label class="custom-control-label" for="typeId${type_index}">${type.name}</label>
                                </div>
                                [/#list]
                                [/@GuestbookTypeList]
                            </div>
                        </div>
                    </fieldset>
                    <div class="form-group row">
                        <label for="username" class="col-sm-2 col-form-label">真实姓名</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="username" name="username" maxlength="50">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="mobile" class="col-sm-2 col-form-label">联系电话</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="mobile" name="mobile" maxlength="50">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="email" class="col-sm-2 col-form-label">电子邮箱</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="email" name="email" maxlength="50">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="captcha" class="col-sm-2 col-form-label">验证码<strong class="text-danger">*</strong></label>
                        <div class="col-sm-10">
                            <div class="input-group">
                                <input type="text" class="form-control" id="captcha" name="captcha" autocomplete="off"
                                       data-rule-required="true" data-msg-required="请输入验证码" data-rule-remote='{"url":"${ctx}/captcha","type":"post"}' data-msg-remote="验证码错误">
                                <div class="input-group-append">
                                    <img id="captchaImg" src="${ctx}/captcha" class="input-group-text" style="cursor:pointer;padding:0;" title="点击重新获取验证码" onclick="this.src='${ctx}/captcha?d='+new Date()*1;$('#captcha').focus();">
                                </div>
                            </div>
                        </div>
                    </div>
                    <button type="submit" class="btn btn-primary">确认提交</button>
                </form>
                [/#if]
            </div>
        </div>
    </div>
</div>
[#include 'inc_footer.html'/]
</body>
</html>
[/#escape]

[#--
<!doctype html>
[#escape x as (x)!?html]
<html lang="zh-CN">
<head>
    <meta charset="utf-8" />
    <title>留言板_${site.fullNameOrName}${global.customs['poweredBy']}</title>
    <meta name="keywords" content="留言板" />
    <meta name="description" content="留言板" />
    <link href="_files/global.css" rel="stylesheet" />
    <link href="_files/style.css" rel="stylesheet" />
    [#include 'inc_js.html'/]
    <style>
        .form-item {
            margin-top: 20px;
        }

        .form-label {
            float: left;
            padding-right: 30px;
            width: 130px;
            font-size: 14px;
            font-weight: bold;
            text-align: right;
        }

        .form-input {
            float: left;
        }
    </style>
</head>
<body>
[#include 'inc_header.html'/]
<div class="w center">
    <div class="ff-yh b fs16" style="padding:6px 5px 6px 5px;border-bottom:4px solid #993333;"><a href="${dy}/guestbook" class="left fs18 a-none" style="color:#cc3333;padding-top:5px;">撰写留言</a><a href="${dy}/guestbook" class="a-hover right"
                                                                                                                                                                                                    style="padding:4px 10px;background-color:#cc3333;color:#fff;">留言版</a>
        <div class="clear"></div>
    </div>

</div>
[#include 'inc_friendlink.html'/]
[#include 'inc_footer.html'/]
</body>
</html>
[/#escape]
--]